<template>
    <div class="ruleResult">
        <div class="ruleResult_title">填报数据辅助审查结果如下:</div>
        <!-- <div class="ruleResult_list" v-for="(item,index) in list" :key="index">
            <div class="left">
                <Icon v-if="item.state === '0'" type="alert-circled" :size="30" color="orange"></Icon>
                <Icon v-if="item.state === '1'" type="ios-locked-outline" :size="30" color="red"></Icon>
            </div>
            <div class="right">
                <p>{{item.content}}</p>
            </div> -->
        <div v-for="(item,index) in resultList" :key="index" style="background:#eee;padding: 20px">
            <Card :bordered="false">
                <p slot="title">
                    <Icon v-if="item.type !== 'lock'" type="alert-circled" :size="20" color="orange"></Icon>
                    <Icon v-if="item.type === 'lock'" type="ios-locked-outline" :size="20" color="red"></Icon>
                    {{item.name}}
                    </p>
                <p>{{item.msg}}</p>
            </Card>
        </div>
      <div class="shuoming">
        <Icon  type="alert-circled" :size="20" color="orange"></Icon>
        <span>代表提醒，</span>
        <Icon  type="ios-locked-outline" :size="20" color="orange"></Icon>
        <span>代表锁定</span>
      </div>
      <Button class="close" type="primary" @click="close()">关闭</Button>
      <MyFooter/>
    </div>
</template>

<script>
  import MyFooter from '../../components/MyFooter.vue'
export default {
  data() {
      return {
          resultList: [{
            type: '0',
            name: '11111',
            msg: '111111111'
          }, {
              type: '1',
              name: '222222',
              msg: '222222222'
          }]
      }
  },
  methods: {
    close() {
      this.$router.go(-1)
    }
  },
  mounted() {
    if (this.$route.params.resultList) {
      this.resultList = JSON.parse(this.$route.params.resultList)
    }
  },
  components: {
    MyFooter
  }
}
</script>

<style lang="scss">
.ruleResult{
    &_title{
        padding-left: .54rem;
        font-size: .72rem;
        line-height: 2rem;
    }
    &_list{
        margin: 0 .54rem;
        overflow: hidden;
        border: 1px solid gainsboro;
        .left{
            float: left;
            width: 20%;
            text-align: center;
            vertical-align: middle;
            border-right: 1px solid gainsboro;
            .ivu-icon{
                line-height: 2rem;
            }
        }
        .right{
            float: left;
            padding-left: .54rem;
            p{
                font-size: .64rem;
                line-height: 1.2rem;
            }
        }
    }
  .shuoming{
    text-align: right;
  }
  .close{
    display: block;
    margin: 1rem auto;
  }
}
</style>
